body { 
    background-color: #202020;
}
progress { 
    margin: 50px auto;
    width:  40px;
    height: 24px;
    display: block;
    -webkit-appearance: none;
    opacity: 0.8;
}
progress::-webkit-progress-bar {
    background-color: transparent;
    background-image: linear-gradient(to right, 
				      #303030       0%,
				      #303030      12%, 
				      transparent  12%,
				      transparent  22%,
				      #303030      22%,
				      #303030      32%, 
				      transparent  32%,
				      transparent  44%,
				      #303030      44%,
				      #303030      56%, 
				      transparent  56%,
				      transparent  66%,
				      #303030      66%,
				      #303030      78%, 
				      transparent  78%,
				      transparent  88%,
				      #303030      88%,
				      #303030     100%);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}
progress::-webkit-progress-value { 
    background-color: transparent;
    background-image: linear-gradient(to right, 
				      white        0px,
				      white        5px, 
				      transparent  5px,
				      transparent  9px);

    background-repeat: repeat-x;
    background-size: 9px 100%;				 
}
.test { 
    background-image: linear-gradient(to right, white,
				      white 10px, 
				      rgba(1,1,1,0) 10px,
				      rgba(1,1,1,0) 20px);
    background-size: 20px 100%;
    background-repeat: repeat-x;
}
